import advListView from "$v/advList"
import {
  addAdvRequest,
  advListRequest,
  deleteAdvListRequest,
  getUpdateDataRequest,
  updateAdvRequest
} from "$a/advListApi";
import {isLoginRequest} from "$a/loginApi";

//封装一个获取所有广告列表的函数
const getAllAdvList = async (pageNo = 1, everyNum = 3) => {
  //发送请求
  try {
    //一旦return 则当前函数返回一个promise实例 值为当前await的返回值
    return await advListRequest(pageNo, everyNum);
  } catch (e) {
    alert("查询出现异常" + e.message);
    //判断是否是权限异常
    if (!e.isLogin) {
      return router.go("/login");
    }
  }

}

export default async (req, res) => {

  //检测登录权限
  try {
    await isLoginRequest();
  } catch (e) {
    //请求异常后提示用户
    alert("账户权限异常" + e.message)

    //判断是否是权限异常
    if (!e.isLogin) {
      return router.go("/login");
    }
  }
  //调用获取adv列表的函数
  const {
    advList,
    pageCount
  } = await getAllAdvList()
  // console.log("advList",advList)
  //根据数据渲染
  res.render(advListView({
    advList,
    pageCount
  }))


  document.onclick = async function (e) {
    //添加广告逻辑
    if (e.target.id === "adv-save") {
      //收集表单数据 使用FormData
      const myForm = new FormData(document.advForm);
      // console.log(myForm.get("advTitle"));
      // console.log(myForm.get("advType"));
      // console.log(myForm.get("advOrder"));
      // console.log(myForm.get("advPic"));
      if (!myForm.get("advTitle") || !myForm.get("advType") || !myForm.get("advOrder") || !myForm.get("advPic")) {
        return alert("添加的内容不能有空的！！！！")
      }
      // console.log(myForm)
      //发送请求
      try {

        await addAdvRequest(myForm)
        alert("添加广告成功")
        //关闭添加广告的弹窗
        document.getElementById("addClose").click();
        //调用获取adv列表的函数
        //调用获取adv列表的函数
        //调用获取adv列表的函数
        const {
          advList,
          pageCount
        } = await getAllAdvList()
        // console.log("advList",advList)
        //根据数据渲染
        res.render(advListView({
          advList,
          pageCount
        }))

        // const {
        //   advList
        // } = await getAllAdvList()
        // // console.log("advList",advList)
        // //根据数据渲染
        // res.render(advListView({
        //   advList
        // }))
        //把预览的img隐藏
        const oPreImg = document.getElementById('preImg');
        oPreImg.style.display = "none"
        //清空表单
        document.advForm.reset();

      } catch (e) {
        alert("添加广告异常" + e.message)
        document.getElementById("addClose").click();
      }
    }

  //  删除广告的逻辑
    if (e.target.nodeName === "BUTTON"&& e.target.classList.contains("btn-delete")){
    //  获取保存的_id
    //   console.log("e.target.dataset.id",e.target.dataset.id)
      const _id = e.target.dataset.id
      try {
        await deleteAdvListRequest(_id)
        alert("删除广告成功!!")
        //调用获取adv列表的函数
        //调用获取adv列表的函数
        const {
          advList,
          pageCount
        } = await getAllAdvList()
        // console.log("advList",advList)
        //根据数据渲染
        res.render(advListView({
          advList,
          pageCount
        }))
      }catch (e) {
        console.log("删除广告失败,"+e.message)
        alert("删除广告失败" + e.message)
        //判断是否是权限异常
        if (!e.isLogin) {
          //关闭添加广告的弹窗再跳转
          document.getElementById("addClose").click();
          return router.go("/login");
        }
      }
    }

  //  更新广告的逻辑
    if (e.target.nodeName === "BUTTON" && e.target.classList.contains("btn-update")){
      // console.log('更新按钮被点击')
    //  按钮正常,开始写点击按钮的api请求
      const _id = e.target.dataset.id;
      try {
        const updateData = await getUpdateDataRequest(_id);
        console.log(updateData);

        //把数据放入更新的窗口中
        // console.log(document.updateForm);
        document.updateForm.advTitle.value = updateData.advTitle;
        document.updateForm.advType.value = updateData.advType;
        document.updateForm.advOrder.value = updateData.advOrder;

        //给当前弹窗的更新按钮上添加一个自定义属性 保存当前数据的id  方便以后提交
        document.getElementById('adv-update').dataset.id = updateData._id;
      } catch (e) {
        alert("更新查询失败" + e.message)
      }
    }

    //点击更新逻辑
    if (e.target.id === "adv-update") {
      const _id = e.target.dataset.id;
      //收集表单数据 使用FormData
      const myForm = new FormData(document.updateForm);

      if (!myForm.get("advTitle") || !myForm.get("advType") || !myForm.get("advOrder") || !myForm.get("advPic")) {
        return alert("添加的内容不能有空的！！！！")
      }

      try {
        await updateAdvRequest(myForm, _id);
        console.log("更新成功");

        //重新渲染视图
        //调用获取adv列表的函数
        //调用获取adv列表的函数
        const {
          advList,
          pageCount
        } = await getAllAdvList()
        // console.log("advList",advList)
        //根据数据渲染
        res.render(advListView({
          advList,
          pageCount
        }))
        //关闭添加广告的弹窗再跳转
        document.getElementById("updateClose").click();

        document.querySelector('.modal-backdrop').style.display = "none";

      } catch (e) {
        alert("更新广告异常" + e.message);
        //判断是否是权限异常
        if (!e.isLogin) {
          //关闭添加广告的弹窗再跳转
          document.getElementById("updateClose").click();
          return router.go("/login");
        }
      }
    }

    // 添加点击页码的功能
    if (e.target.nodeName === "SPAN" && e.target.parentNode.id === "page") {
      //重新发送请求 并传入当前要加载的页码
      const pageNo = +e.target.dataset.pageno;
      const {
        advList,
        pageCount
      } = await getAllAdvList(pageNo)
      //根据数据渲染
      res.render(advListView({
        advList,
        pageCount
      }))
    }


  }

  document.onchange = function (e) {

    if (e.target.id === "advPic") {

      const reader = new FileReader();
      //把图片制作成base64的格式
      reader.readAsDataURL(e.target.files[0])

      reader.onload = function (e) {
        // console.log(e.target.result);
        //把当前的读取的base64格式 给到img
        const oPreImg = document.getElementById('preImg');
        oPreImg.src = e.target.result;
        oPreImg.style.display = "block"
      }
    }
  }

}